Vue.js知识点杂记

渲染

深入式响应--页面监听对象或数组型的数据变化，简单的设置某个元素的的值是无效的，要使用push等变异方法，或者使用vue.$set()

nextTick--DOM发生变化后会执行写入的回调函数

父子组件传值

子传给父--this.$emit()触发事件，传递数据

父传给子--如果是一个对象的话，在父组件的data里要把对象的属性都要声明出来，不然在子组件是渲染不出来的，
同时属性要初始化

prop值修改问题--不要轻易修改组件中prop的值（它是用来父组件传值给子组件，随意修改会影响其在父组件里的数据混乱）对于引入类型的数据如数组和对象来说，它们的值则是数据的地址。这是要区分开来的。

对prop进行“双向绑定”--在一个包含prop的子组件中，用this.$emit('update:title', newTitle)来表达对其赋新值的意图。然后在父组件中可以监听那个事件并更新一个本地的数据属性
<text-document v-bind:title.sync="doc.title"></text-document>

路由

路由前置守卫--想要结束路由守卫，整段代码的逻辑必须有next()进行结尾。

this.$route--定位到了当前路由的对象，可以获取到query、params、name、path等信息
this$router为VueRouter实例，通过push、replace等函数实现了路由的跳转

watch监听

watch失效问题--监听对象，要加一个配置 deep: true
因为对象的值是一个引用，我们改变对象属性的值的时候，改变的不是这个对象的引用，因此监听不到

watch中oldVal对于深度监听对象是无效的，其实对于oldValue的值和newValue的值等同这种现象是合理的，因为都指向了同一个引用，值当然是一样的

其他

混入--分发vue组件中可复用的功能，混入组件的意思是，其他组件可以使用被混入组件的计算属性

template--语义化标签，把它当做不可见的包裹元素，最后不会渲染出来，一般用于插槽，v-if渲染和v-for渲染

在computed的方法内如传递参数--使用闭包